會接觸正則表達式(RegExp)是因為前一篇的文章ng-pattern,但正則似乎是所有語言通用的,所以學起來絕對不吃虧。
網路上有太多太多的資源可以查詢了,我也比較會用基本的數字判斷而已,所以這篇主要分享我學習上的一些小地雷觀念。
一次只能設定一個字
一次只能設定一個字
一次只能設定一個字
為什麼重複三次標題,因為這是我踩的一個很大的雷,網路上有很多資源,其中我的需求是要限制一個範圍的數字,例如只能輸入0~1500之間的數字,這時候其中一個網站給我一個很猛的寫法是^[0-1500]$,我在那邊試老半天一值給我很奇怪的數字範圍。
後來很不爽直接關鍵字全打英文想找國外的說明,發現有個頗棒的外文網站解釋得真的很好,參考此連結,老實說我覺得英文的資源說明真的比較明白,中文的資源真的沒有在解釋比較完整的觀念。
大中小括號各司其職{}[]()
首先在JS的正則會用兩條斜線包起來,像這樣/Some RegExp/
,而想要限制什麼樣的文字照著打即可(例如/9453/,/helloworld/,/taiwanNo1),RegExp是很精明的所以大小寫全形半形都不可以不同。
中括號[]–一個單字的象徵
但我們不可能像上面的例子量身定做,我們需要一個單字的範圍值,例如我要單個任意數字
,這邊的單個只的真的是一個數字,不能是0.1或01這種有單個以上的數字,是最基本的0,1,2,3,4,5,6,7,8,9,這時候我們要的那個單字範圍是0~9,在正則的規則裡面我們可以用最基本的^[0-9]$
表達,注意中間是-
哦。
那英文怎麼辦?英文也可以用範圍來表示,順序為字母序有分大小寫
!
例如[a-z]
為可以輸入小寫a~z任一個字母,而[A-Z]
則是可以輸入大寫,那如果想要大小寫都可以呢?[a-zA-Z]
可以表達出來,中間不用加任何符號,因為-
只會認左右邊的第一個單字!!所以如果不小心寫錯如[aA-Z]
他只會認得A~Z這個範圍哦!
所以最基本範圍是任意大小寫英文和數字的單字表達為[a-zA-Z0-9]
,這樣我們知道中括號是做什麼事情的囉!
大括號{}–象徵必須使用次數
大括號是緊緊黏在一個單字後面的,他做的事情例如{m,n}
代表的是使用最少m次最多n次,看幾個最簡單的範例:^[a-z]{1,5}$
a~z任意單字出現一到五次。
符合的有:apple,cat,dog
不符合的:Dog,and1,hellowworld,0^B[0-9]{5}$
一個B後面接任意數字五個。
符合的有:B12345,B12,B999
不符合的:C12345,12345,BB123^0{3}AC{1,}$
三個0一個A和一到無限次的C
符合的有:000AC,000ACCCCCCCCCCC
不符合的:111AC,000A,000C,000ACC^7{,3}$
最多三個7
符合的有:7,77,777
不符合的:07,7777,a7
大括號的工作就是限制次數囉!
小括號()–合併為一個敘述
跟數學運算符號一樣用法,就是先執行括號內的東西,小括號也經常跟tube|
搭配在一起,用一個簡單的例子:^([a-z]|[0-9]){1,3}[A-Z]{,3}$
小括號內先執行,所以是任意單字a~z或者
任意數字0~9,兩個其中一個出現一到三次,緊接著出現三次以內的大寫英文單字A~Z。
綜合三大括號我們再舉一個例子:^([A-Z][a-z]{,10})|(09[0-9]{8})$
看出來了嗎?請填寫英文名字或者手機號碼,因為我的設定為開頭為一個大寫英文字母後面緊接著最多十個的小寫字母或者
開頭為09後面緊接著八次任意數字。
但這有個弊案,會不會有人的英文名字真的只有一個大寫字母?抑或者名字真的超過十一個字母單字?這時候我們就可以用符號來表示了!
常用符號^$?*+
要維持著正則的穩定性,一定要加上最常用的^
和$
符號,\^緊接著一個單字代表開頭,一個單字後面緊接著$代表結尾,直接看例子:^[a-z]331$
代表開頭一個小寫a~z的單字後面接33並最後是接1,但為什麼還要特別指定開頭和尾巴?
正則是可以去匹配一整篇文章(例如新聞)的方式,不斷重複尋找符合條件的單字,所以如果再使用者輸入的欄位不加上\^和$只要中間有夾雜著符合條件的單字也許
是可以輸入的上去的哦!不過這邊我是沒驗證過XD。
也就是說如果單純[a-z]331
的話a331也符合bbba33111也會有符合條件,所以在製作給使用者的欄位最好是嚴謹一點,多加點符號吧!
其他的常用符號?*+都是緊接在單字後面?
代表需要出現零次會一次*
代表需要出現零次或無限次+
代表需要出現一次或者無限次
這些東西都可以在網路上輕易找到,可以參考這篇。
其他跳脫符號的使用方法就不在贅述了,懂得剛剛說的觀念其實要學習正則表示式不會是很困難的事情囉!